{% extends "layout.html" %}
{% block content %}
<div class="container">
    <div class="row">
        <div class="col-6">
            {{ pagination.info }}
        </div>
        <div class="col-6 text-right">
            {% if current_user.is_authenticated %}
                <a class="text-muted" href="{{ url_for('bookmarks.list_') }}">all</a>&nbsp;⸱&nbsp;
                <a class="text-muted" href="{{ url_for('bookmarks.list_') + 'private' }}">private</a>&nbsp;⸱&nbsp;
                <a class="text-muted" href="{{ url_for('bookmarks.list_') + 'public' }}">public</a>&nbsp;⸱&nbsp;
                <a class="text-muted" href="{{ url_for('bookmarks.list_') + 'unread' }}">unread</a>
            {% endif %}
        </div>
    </div>
    <br />
    <div class="row">
        <div class="col-6">
            {% if tag %}
                <i class="fa fa-tag" aria-hidden="true"></i>&nbsp;&nbsp;{{ tag }}
            {% endif %}
            {% if query %}
                {% if tag %}<br />{% endif %}
                <i class="fa fa-search" aria-hidden="true"></i>&nbsp;&nbsp;{{ query }}
            {% endif %}
        </div>
        <div class="col-6 text-right pull-right">
            <form method="GET">
                <div class="form-row align-items-center pull-right">
                    <div class="col-auto">
                        <div class="input-group">
                            <input type="text" name="query" class="form-control" />
                            <div class="input-group-append">
                                <button type="submit" class="btn btn-primary">Search</button>
                            </div>
                        </div>
                    </div>
                </div>
            </form>
        </div>
    </div>
    <br />
    <div class="row">
        <div class="col-8">
            {{ pagination.links }}
        </div>
    </div>

    <div class="row">
        <div class="col">
            <ul class="list-group">
            {% for bookmark in bookmarks %}
                <li class="list-group-item">
                    <a href="#">
                        <h4 class="list-group-item-heading">
                            <a href="{{ bookmark.href }}">{{ bookmark.title }}</a>
                        </h4>
                        <p class="list-group-item-text">
                            <div class="text-muted">{{ bookmark.description }}</div>
                            <div>{% for tag in bookmark.tags %}<a href="{{ url_for('bookmarks.list_', tag=tag.text) }}">{{ tag.text }}</a>&nbsp;{% endfor %}</div>
                            {{ bookmark.time | datetime }}
                            {% if current_user.is_authenticated %}
                                <a class="text-muted" href="{{ url_for('bookmark.form', bookmark_id=bookmark.id) }}">edit</a>
                                <a class="text-muted" href="{{ url_for('bookmark.delete', bookmark_id=bookmark.id) }}">delete</a>
                            {% endif %}
                        </p>
                    </a>
                </li>
            {% endfor %}
            </ul>
        </div>
    </div>
    <br />
    <div class="row">
        <div class="col-md-8">
            {{ pagination.links }}
        </div>
    </div>
</div><!-- /.container -->
{% endblock %}
